import React, { Component } from 'react'
import {IProduct} from '../types/product'
import {connect} from 'react-redux'

interface Iprops{
    item:IProduct,
    addTar:(target:IProduct) => void
}

class Product extends Component <Iprops>{
    render() {
        let {title,price,img} = this.props.item;
        return (
            <div className="item"> 
                <img src={img} alt=""/>
                <h5>{title}</h5>
                <span>价格:{price}</span>
                <button onClick={() => {this.props.addTar(this.props.item)}}>+</button>
            </div>
        )
    }
}

let stateMapToProps = () => {
    return {}
}
let dispatchMapToProps = (dispatch:any) => {
    return {
        addTar(target:IProduct){
            dispatch({type:'ADD_TAR',target})
        }
    }
}

export default connect(stateMapToProps,dispatchMapToProps)(Product)